<template>
    <div>
        <h1>(管理员查看)登录信息</h1>
        <table class="table table-bordered" border="1">
            <thead>
                <tr>
                    <th>账号ID</th>
                    <th>账号</th>
                    <th>密码</th>
                    <th>注册时间</th>
                    <th>状态</th>
                    <th>操作</th>
                </tr>
            </thead>
            <tbody>
                <tr v-for="item in info" :key="item.U_Lid">
                    <th>{{item.U_Lid}}</th>
                    <th>{{item.U_Lname}}</th>
                    <th>{{item.U_Lpass}}</th>
                    <th>{{item.U_Ldate.substring(0,10)}}</th>
                    <th>{{item.U_Lsex==1?'未删除':'删除'}}</th>
                    <th>
                        <button class="btn btn-danger" @click="del(item.U_Lid)">逻辑删除</button>
                    </th>
                </tr>
            </tbody>
        </table>
        <span>
            <a href="#" @click="King(1)" class="btn btn-primary">首页</a>
            <a href="#" @click="King(page.pageIndex-1)" class="btn btn-primary">上一页</a>
            <a href="#" @click="King(page.pageIndex+1)" class="btn btn-primary">下一页</a>
            <a href="#" @click="King(page.pageCount)" class="btn btn-primary">尾页</a>
        </span>
    </div>
</template>

<script setup lang="ts">

import { onMounted, ref} from 'vue';
import axiox from 'axios';
import { useRouter } from 'vue-router';
const router = useRouter();

const page = ref({
    pageSize:2,
    pageIndex:1,
    recordCount:0,
    pageCount:0,
})
onMounted(() => {
    LoginShow()
})

const King=(id:any)=>{
    if(id>=1&&id<=page.value.pageCount)
    {
        page.value.pageIndex = id
        LoginShow()
    }
    else
    {
        alert('超出页数范围')
        return;
    }
}


const info :any= ref([])

const LoginShow = () => {
    axiox({
        method:'get',
        url:'http://localhost:51873/api/User/MatserShow',
        params:{
            pageSize:page.value.pageSize,
            pageIndex:page.value.pageIndex,
        }
    })
    .then(res => {
        info.value = res.data.list,
        page.value.recordCount = res.data.recordCount
        page.value.pageCount = res.data.pageCount
    })
    .catch(err => {
        console.log(err);
    })
}

const del = (id:any) => {
    if(!confirm('确定进行逻辑删除吗？'))
    {
        return;
    }
    axiox({
        method:'get',
        url:'http://localhost:51873/api/User/MatserDel',
        params:{
            id:id
        }
    })
    .then(res => {
        if(res.data>0)
        {
            alert('删除成功')
           router.push('/MatserShow')
        }
        else
        {
            alert('删除失败')
        }
    })
    .catch(err => {
        console.log(err);
    })
}
</script>